<template>
  <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
    <h2 class="sub-header">留言列表</h2>
    <router-link class="btn btn-success" to="/newmsg">添加留言</router-link>
    <div class="table-responsive">
      <table class="table table-hover table-striped">
        <thead>
          <tr>
            <th>姓名</th>
            <th>内容</th>
            <th>时间</th>
          </tr>
        </thead>
        <tbody>
          <tr v-for="info in infos" :key="info.id">
            <td style="width:10%">{{ info.name }}说：</td>
            <td style="width:60%">{{ info.msg }}</td>
            <td style="width:20%">{{ info.time }}</td>
            <td style="width:10%">
              <!-- <a class="btn btn-primary btn-sm">编辑</a> -->
              <a class="btn btn-danger btn-sm" @click="deleteMsg(info.id,info.name)">删除</a>
            </td>
          </tr>
        </tbody>
      </table>
    </div>
  </div>
</template>
<script>
import { Toast } from "mint-ui";
export default {
  props: ["infos"],
  methods: {
    deleteMsg(index, name) {
      var id = parseInt(index);
      this.$http.get("/msg/delete", { params: { id } }).then(() => {
        this.$parent.getInfos();
        Toast({
          message: name + "说的留言删除成功",
          position: "middle",
          duration: 1000,
          iconClass: "glyphicon glyphicon-ok"
        });
      });
    }
  },
};
</script>
<style>
</style>
